<tr>
    <td class="cell-select"><ng-content></ng-content></td>

    <td class="content-field" [field]="metaFields.lastModifiedByAvatar" sqxContentListCell>
        <sqx-content-list-field
            [content]="content"
            [field]="metaFields.lastModifiedByAvatar"
            [language]="language"
            [languages]="languages"
            [schema]="undefined" />
    </td>

    @for (value of values; track value) {
        <td class="cell-auto cell-content"><sqx-content-value [value]="value" /></td>
    }

    @if (validityVisible) {
        <td class="cell-valid">
            @if (isValid === true) {
                <span class="badge rounded-pill badge-success">VALID</span>
            }

            @if (isValid === false) {
                <span class="badge rounded-pill badge-danger">INVALID</span>
            }
        </td>
    }

    <td [field]="metaFields.statusColor" sqxContentListCell>
        <sqx-content-list-field [content]="content" [field]="metaFields.statusColor" [language]="language" [languages]="languages" [schema]="undefined" />
    </td>

    @if (!isCompact) {
        <td class="cell-label">
            <div class="bg-container d-flex align-items-center">
                <span class="badge badge-primary rounded-pill truncate-inline">{{ content.schemaDisplayName }}</span>
            </div>
        </td>
    }

    <td class="cell-actions">
        <div class="reference-edit">
            <button class="btn btn-text-secondary" attr.aria-label="{{ 'common.options' | sqxTranslate }}" type="button">
                <i class="icon-dots"></i>
            </button>
            <div class="reference-menu">
                <button class="btn btn-text-secondary" (click)="clone.emit()" title="{{ 'common.clone' | sqxTranslate }}">
                    <i class="icon-copy"></i>
                </button>
                @if (canRemove) {
                    <button
                        class="btn btn-text-secondary"
                        confirmRememberKey="removeReference"
                        confirmText="i18n:contents.removeConfirmText"
                        confirmTitle="i18n:contents.removeConfirmTitle"
                        (sqxConfirmClick)="delete.emit()"
                        type="button">
                        <i class="icon-close"></i>
                    </button>
                }
                <a class="btn btn-text-secondary" [routerLink]="['../..', content.schemaName, content.id]" target="_blank">
                    <i class="icon-pencil"></i>
                </a>
            </div>
        </div>
    </td>
</tr>

<tr class="spacer"></tr>
